<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>用户管理</title>
<link href="../../style/style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="../../js/jquery.min.js"></script>
<style>
body{
width:100%;
}
/* .div1,.div2,.div3{
border:1px solid red;
width:30%;
height:400px;
float:left;
}
.clearfix{
border:1px solid red;
height:200px;
width:100%;
}
.clearfix:after { 

    visibility: hidden; 
    display: block; 
    font-size: 0; 
    content: " "; 
    clear: both; 
    height: 0; 
} 
.clearfix { display: inline-table; } 
button{
clear:both;
}
.b{
display:inline;
width:50px;
}
.a{
display:inline;
width:300px;
} */
.content{
width:100%;
height:300px;
}
.left,.in{
float:left;
border:1px solid red;
width:100px;
}
.userid,.classifyid,.objectid,.fieldid{
display:none;
}
</style>
</head>
	<body class="a_height">
	<div class="content">
	
	<div class="left"></div>
	<div class="in"></div>
	</div>
	
	<div>
	<button class="submit" onclick="submit()">添加</button>
	</div>
	
	
	
	
	
	
	
<!-- 	<div class="clearfix">
     <div class="div1"></div>
     <div class="div2"></div>
     <div class="div3"></div>  
    </div>
    <div><button onclick="submit()">submit</button></div>
    <div style="width:700px">
    <div class="a">
    <div class="b">11 </div>
    <div class="b">12 </div>
    <div class="b"> 13</div>
    </div>
     <div class="a">
    <div class="b">11 </div>
    <div class="b">12 </div>
    <div class="b"> 13</div>
    </div>
    </div> -->
    <script type="text/javascript">
function submit(){
	
}
$(document).ready(function(){
	var object="";
	var classify="";
	var field="";
	
	var user;
	
	//提交所有信息
	$(".submit").click(function(){
		
		//用户信息
		$("[name=userbox]").each(function(){

			if ($(this).prop("checked")) {
				user=$(this).parent("span").siblings(".userid").text();
			}
		});
		
		//分类信息
		$("[name=classifybox]").each(function(){

			if ($(this).prop("checked")) {
				
				classify+=$(this).siblings(".classifyid").text();
				classify+=",";
			}
		});
		
		//数据对象信息
		$("[name=objectbox]").each(function(){

			if ($(this).prop("checked")) {

				object+=$(this).siblings(".objectid").text();
				object+=",";
			}
		});
		
		//字段信息
		$("[name=fieldbox]").each(function(){

			if ($(this).prop("checked")) {

				field+=$(this).siblings(".fieldid").text();
				field+=",";
			}
		});
		console.log(user+classify[0]+object[0]+field[0]);
		
		//与后台交互
		$.ajax({
			type:"POST",
			data:{"user":user,"classify":classify,"object":object,"field":field}, 
			url:"addRelation!addRelation",
			dataType:"json",
			success:function(data){
				alert("赋予权限成功");
			}
		});
	});
	
	
	//不同行背景颜色不同
	$(".content_table tr:even").css("background-color","#f1f6f9");
	
	//只准许一个选中框
 	$('.left').find('input[type=checkbox]').bind('click', function(){
 		
        $('.left').find('input[type=checkbox]').not(this).attr("checked", false);
	}); 

	//获取数据库中的信息
	$.ajax({
		type : "POST",
		url : "getData!getData",
		dataType:"json",
		success : function(data) {
			setTimeout(500);
			
			var checkbox;
			/* for(var key in data[0][1]){
				console.log(key+data[0][1][key]);
				var span = $('<span>'+data[0][1][key]+'</span>');
				li.append(span);
			} */
			//生成姓名
			var ul = $('<ul></ul>');	
			for(var i=0;i<data[0].length;i++){
				var li = $('<li></li>');
				var span = $('<span></span');
				checkbox = $('<input class="user_box" type="radio" name="userbox"/>');
				span.append(checkbox);
				li.append(span);
				var span = $('<span class="userid">'+data[0][i].id+'</span>');
				li.append(span);
				var span = $('<span>'+data[0][i].name+'</span>');
				li.append(span);
				var br = $('<hr/>');
				ul.append(br);
				ul.append(li);
			}
	       $(".left").append(ul);
	       
	       
	       
	       //生成查询条件
	       var classifyName;
	       var ul = $('<ul></ul>');	
			for(var i=0;i<data[1].length;i++){
				var li = $('<li></li>');
				
				if(classifyName!=data[1][i].classifyName){
					classifyName = data[1][i].classifyName;	
					checkbox = $('<input class="user_box" type="checkbox" name="classifybox" onclick="classifyBoxChange(this)"></input>');
					li.append(checkbox);
					var span = $('<span class="classifyid">'+data[1][i].classifyid+'</span>');
					
					li.append(span);
					var span = $('<span>'+data[1][i].classifyName+'</span>');
					 var ul1 = $('<ul></ul>');	
					 var objectName;
					 for(var j=0;j<data[1].length;j++){
						 var li1 = $('<li></li>');
				
							 if(data[1][j].objectname!=objectName && data[1][j].classifyName==data[1][i].classifyName){
								 objectName =data[1][j].objectname; 
								 checkbox = $('<input class="user_box" type="checkbox" name="objectbox" onclick="objectBoxChange(this)"></input>');
									li1.append(checkbox);
							 var span1 = $('<span class="objectid">'+data[1][j].objectid+'</span>');
							 li1.append(span1);
							 var span1 = $('<span>'+data[1][j].objectname+'</span>');
							 
							 var ul2 = $('<ul></ul>');	
							 console.log(data[1][j].objectname);
							 var filedname;
							 for(var k=0;k<data[1].length;k++){
								 var li2 = $('<li></li>');
								 console.log(filedname+"..."+data[1][k].fieldname+"..."+data[1][j].classifyName+"..."+data[1][i].classifyName+"..."+data[1][k].objectname+"..."+data[1][j].objectname);
								 if(filedname!=data[1][k].fieldname&& data[1][j].classifyName==data[1][i].classifyName&&data[1][k].objectname==data[1][j].objectname){
									
									 filedname = data[1][j].fieldname;
									 checkbox = $('<input class="user_box" type="checkbox" name="fieldbox" onclick="fieldBoxChange(this)"></input>');
									li2.append(checkbox);
									 var span2 = $('<span class="fieldid">'+data[1][k].fieldid+'</span>');
									 li2.append(span2);
									 var span2 = $('<span>'+data[1][k].fieldname+'</span>');
									
									 li2.append(span2);
				
									 ul2.append(li2);
								 }
								 
							 
							 }

							 li1.append(span1);
							 li1.append(ul2);
							 ul1.append(li1);
						 }
							 
						 
					 }
					li.append(span);
					li.append(ul1);
					ul.append(li);
				
				}
				
			}
			
			 $(".in").append(ul);

		}
	}); 
});

function objectBoxChange(a){
	
	if($(a).parent().parent().siblings("input").prop("checked")!=true){
		alert("请先选择当前对象所在分类");
		$(a).attr("checked",false);
	} 
}
function fieldBoxChange(a){
	
	if(($(a).parent().parent().siblings("input").prop("checked")!=true ) || ($(a).parent().parent().parent().parent().siblings("input").prop("checked")!=true)){
		
		alert("请先选择当前字段所在对象或所在分类");
		$(a).prop("checked",false);
	}
	
}

function classifyBoxChange(a){

	var i=0;
	$("input[type=radio]").each(function(){
	if($(this).prop("checked")){
		
		i=1;
	}
});

	if(i==0){
		alert('请先选择用户');
		$(a).attr("checked",false);
	}
}
</script>

</body>
</html>